<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2018/1/2
  Time: 17:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix= "c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>

<head>
    <%
        pageContext.setAttribute("APP_PATH",request.getContextPath());

    %>
    <link href="${APP_PATH}/static/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <script type = "text/javascript" src ="${APP_PATH}/static/js/jquery-3.2.1.js"></script>
    <script type = "text/javascript" src = "${APP_PATH}/static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <title>员工列表</title>
</head>
<body>

    <div class = "container">
        <!-- 显示标题 -->
        <div class = "row">
            <div class = "col-md-12">
                <h1>员工信息</h1>
            </div>
        </div>
        <!-- 显示按钮 -->
        <div class = "row">
            <div class="col-md-2 col-md-offset-10">
                <button class = "btn btn-primary">新增</button>
                <button class = "btn btn-danger">删除</button>
            </div>
        </div>
        <!-- 表格主体部分-->
        <div class = "row">
            <table class = "table table-hover">
                <tr>
                    <th>员工号</th>
                    <th>姓名</th>
                    <th>性别</th>
                    <th>电子邮箱</th>
                    <th>部门号</th>
                    <th>操作</th>
                </tr>
                <c:forEach items="${pageInfo.list}" var="employee">
                <tr>
                    <td>${employee.empId}</td>
                    <td>${employee.empName}</td>
                    <td>${employee.gender == "M" ? "男" : "女"}</td>
                    <td>${employee.email}</td>
                    <td>${employee.department.deptName}</td>
                    <td>
                        <button class = "btn btn-info btn-primary btn-sm">
                            <span class=" glyphicon glyphicon-pencil" aria-hidden="true"></span> 编辑
                        </button>
                        <button class = "btn btn-danger btn-primary btn-sm">
                            <span class=" glyphicon glyphicon-trash" aria-hidden="true"></span>删除
                        </button>
                    </td>
                </tr>
                </c:forEach>
            </table>
        </div>
        <!-- 分页 -->
        <div class = "row">
            <div class = "col-md-6">当前页${pageInfo.pageNum}/总页数${pageInfo.pages}</div>
            <div class="col-md-6">
                <nav aria-label="Page navigation">
                    <ul class="pagination">
                        <li>
                            <a href = "${APP_PATH}/getAllEmployeeInfo?pageNum=1">首页</a>
                        </li>
                        <!-- 上一页 -->
                        <li>
                            <c:if test = "${pageInfo.hasPreviousPage}">
                                <a href="${APP_PATH}/getAllEmployeeInfo?pageNum=${pageInfo.pageNum - 1}" aria-label="Previous">
                                    <span aria-hidden="true">&laquo;</span>
                                </a>
                            </c:if>
                        </li>

                        <c:forEach items="${pageInfo.navigatepageNums}" var="page">
                            <c:if test = "${page == pageInfo.pageNum}">
                                <li class = "active"><a href = "#">${page}</a></li>
                            </c:if>
                            <c:if test = "${page != pageInfo.pageNum}">
                                <li><a href = "${APP_PATH}/getAllEmployeeInfo?pageNum=${page}">${page}</a></li>
                            </c:if>
                        </c:forEach>

                        <!-- 下一页 -->
                        <c:if test = "${pageInfo.hasNextPage}">
                            <li>
                                <a href="${APP_PATH}/getAllEmployeeInfo?pageNum=${pageInfo.pageNum + 1}" aria-label="Next">
                                    <span aria-hidden="true">&raquo;</span>
                                </a>
                            </li>
                        </c:if>

                        <li>
                            <a href = "${APP_PATH}/getAllEmployeeInfo?pageNum=${pageInfo.pages}">尾页</a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
    </div>

</body>
</html>
